<security:authorize ifNotGranted="ROLE_DEALER_ADMIN,ROLE_DEALER_USER">
  <div class="box box-primary">
    <div class="box-header  with-border">
      <h3 class="box-title"><fmt:message key="talkRecordList.title"/>
          <c:if test="${loanRequest.phase=='cc_audit' || loanRequest.phase=='ca_audit' || loanRequest.phase=='sca_audit'}">
              <a  class="btn btn-primary btn-xs margin" id="open-talk"><i class="fa fa-plus"></i> <fmt:message key="talkRecord.add"/></a>
          </c:if></h3>
      <div class="box-tools pull-right">
        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
      </div>
    </div>
    <!-- /.box-header -->
    <div class="box-body" style="height: 200px;overflow-y:auto;">
      <table class="table table-condensed" id="talkRecordList">
          <thead>
              <tr>
                <th><fmt:message key="feedback.time"/></th>
                <th><fmt:message key="feedback.operator"/></th>
                <th><fmt:message key="feedback.content"/></th>
                <th><fmt:message key="user.phoneNumber"/></th>
              </tr>
          </thead>
          <tbody>
              <c:forEach var="talkRecord" items="${loanRequest.talkRecordList}">
              <tr>
                <td><fmt:formatDate value="${talkRecord.time}" type="both" pattern="${datetimePattern}"/></td>
                <td>${talkRecord.operator}</td>
                <td class="feedbackContent" title="${fn:length(talkRecord.content) > 10 ? talkRecord.content : ''}">${fn:length(talkRecord.content) > 10 ? fn:substring(talkRecord.content,0,10) : talkRecord.content} ${fn:length(talkRecord.content) > 10 ? '...' : ''}</td>

                  <td>${talkRecord.number}</td>
              </tr>
              </c:forEach>
          </tbody>
      </table>

    </div>
      <div class="overlay" id="talkOverlay" style="display: none">
          <i class="fa fa-refresh fa-spin"></i>
      </div>
  </div>
    <div id="talk" title="<fmt:message key="talkRecordList.title"/>">
        <form class="form">
            <fmt:message key="talkRecord.current"/>
            <div class="form-group">
                <div class="col-sm-3">
                    <select class="form-control" id="talkPerson">
                        <option value="mainPerson"><fmt:message key="loanRequest.mainApplicant"/></option>
                        <option value="coPerson"><fmt:message key="loanRequest.coName"/></option>
                        <option value="dbPerson"><fmt:message key="loanRequest.dbName"/></option>
                        <option value="dealer"><fmt:message key="loanRequest.dealer"/> </option>
                        <option value="urgent1"><fmt:message key="loanRequest.urgentContact1"/></option>
                        <option value="urgent2"><fmt:message key="loanRequest.urgentContact2"/></option>
                        <option value="urgent3"><fmt:message key="loanRequest.urgentContact3"/></option>
                        <option value="others"><fmt:message key="talkRecord.others"/></option>
                    </select>
                </div>
                <div class="col-sm-3">
                    <select class="form-control" id="talkPhoneType">
                        <option value="mobileNo"><fmt:message key="talkRecord.type.mobile"/></option>
                        <option value="homeTelNo"><fmt:message key="talkRecord.type.home"/></option>
                        <option value="workTelNo"><fmt:message key="loanPerson.workTelNo"/></option>
                    </select>
                </div>
                <div class="col-sm-4">
                    <input class="form-control" id="talkPhoneNumber" value="${loanRequest.requestPerson.mobileNo}" readonly />
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-12">
                    <lable class="control-label"><fmt:message key="feedback.content"/></lable>
                    <textarea row="5" class="form-control" id="talkrecordContent" ></textarea>
                </div>
            </div>
            <a class="btn btn-default" id="saveTalkRecord"><fmt:message key="button.save"/></a>
        </form>

    </div>


</security:authorize>